import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import vueSetupExtend from 'vite-plugin-vue-setup-extend'
import { createHtmlPlugin } from "vite-plugin-html";
const getViteEnv = (mode, target) => {
  return loadEnv(mode, process.cwd())[target];
};
export default defineConfig({
  plugins: [vue(), AutoImport({
    resolvers: [ElementPlusResolver()],
  }),
  Components({
    resolvers: [ElementPlusResolver()],
  }), vueSetupExtend(),
  createHtmlPlugin({
    inject: {
      data: {
        title: getViteEnv('development', "VITE_APP_SITE_TITLE"),
      },
    },
  }),
  ],
  base: './',
  server: {
    host: '0.0.0.0',
    port: getViteEnv('development', 'VITE_APP_BASE_PORT'),
    strictPort: false,
    open: true,
    proxy: {
      '/api': {
        target: 'http://xxx.xxx.xxx.xxx:xxxx',
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, '')
      }
    }
  },
  resolve: {
    alias: [
      {
        find: '@',
        replacement: resolve(__dirname, 'src'),
      },
    ],
  },
});

